<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册您的账号</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/reg.css">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>

<body>
    <div class="main">
        <p class="logo"></p>

        <form action="">
            <p>
                <span>手机号</span>
                <input type="text" class="first">
                <span></span>
            </p>

            <p>
                <span>验证码</span>
                <input type="text" class="second">
                <img src="./img/下载.png" alt="">
                <span>看不清,换一张</span>
            </p>

            <p>
                <span>创建密码</span>
                <input type="password" class="third">
                <span></span>
            </p>
            <p>
                <span>确认密码</span>
                <input type="password" class="fourth">
                <span></span>
            </p>
            <p class="fuxuan">
                <input type="checkbox" class="checkbox" checked> 同意 <a href="" style=" color: #0c79cc;">良仓注册条款</a>
            </p>

            <button class="btn">立即注册</button>

        </form>

        <div class="footer">
            <p></p>
            <a href="login.html">登录良仓</a>
        </div>

    </div>
    <script>
        //正则验证
        let isphone=false;
        $(".first").change(function(){
            let str=this.value;
            console.log(str);
            let reg= /^1[0-9]{10}$/;
            if (reg.test(str)) {
                isphone = true;
                this.nextElementSibling.innerHTML = ""
            } else {
                isphone = false;
                this.nextElementSibling.innerHTML = "手机号码输入不合法"
            }
        })

        let isrepeatpassword = false;
        $(".fourth").change(function(){
            let str = this.value;
            if (str == $(".third").val()) {
                isrepeatpassword = true;
                this.nextElementSibling.innerHTML = ""

            } else {
                isrepeatpassword = false;
                this.nextElementSibling.innerHTML = "两次密码输入不一致";
            }
        })

        //注册请求
        $(".btn").click(function (e) {
            //阻止默认行为
            e.preventDefault();
            let username = $(".first").val();
            let password = $(".third").val();
            let regAPI = "http://jx.xuzhixiang.top/ap/api/reg.php";
            $.get(regAPI, { username, password }).then(r => {
                console.log(r);
                alert(r.msg)
                if (r.code == 1) {
                    location.href = "login.html"
                }
            })
        }) 
    </script>
</body>

</html>